// import { CheckOutlined, LockOutlined, UserOutlined } from '@ant-design/icons';
// import { Alert, message, Tabs } from 'antd';
// import React, { useLayoutEffect, useState } from 'react';
// import { ProFormText, LoginForm } from '@ant-design/pro-components';
// import { useModel } from 'umi';
// import Footer from '@/components/Footer';

// import styles from './index.less';
// import { login, queryCurrentUser, wechatLog, wechatSelectLogin } from '@/services/user/api';
// import { SUCCESS_CODE } from '@/utils/types.d';

// const LoginMessage: React.FC<{
//   content: string;
// }> = ({ content }) => (
//   <Alert
//     style={{
//       marginBottom: 24,
//     }}
//     message={content}
//     type="error"
//     showIcon
//   />
// );

// const Login: React.FC = () => {
//   const [userLoginState, setUserLoginState] = useState<API.LoginResult>({});
//   const [type, setType] = useState<string>('account');
//   const { initialState, setInitialState } = useModel('@@initialState');
//   const [userList, setUserList] = useState<
//     {
//       userid: string;
//       userName: string;
//       ownerId: string;
//       account: string;
//     }[]
//   >([]);
//   const [selectedUserid, setSelectedUserid] = useState<string>('');
//   const randomCode = String((Math.random() * 1000000) << 2);
//   const hashChangeEv = (ev: HashChangeEvent) => {
//     const args = ev.newURL.split('?');
//     if (args.length < 2) {
//       message.error({
//         content: '微信登录失败，请使用账号密码登录',
//         key: 'login_msg',
//       });
//       setType('account');
//       return;
//     }
//     const search = new URLSearchParams(args[1]);
//     // 当前umi/history定义中无query属性，所以这里使用search
//     // const search = new URLSearchParams(location.search);
//     const code = search.get('code');
//     const state = search.get('state');
//     if (!code) {
//       // 无法获取code属性，说明是微信登录失败
//       message.error({
//         content: '微信登录失败，请使用账号密码登录',
//         key: 'login_msg',
//       });
//       setType('account');
//       return;
//     }
//     if (state !== randomCode) {
//       // 防止伪造state
//       message.error({
//         content: '微信登录失败，请使用账号密码登录',
//         key: 'login_msg',
//       });
//       setType('account');
//       return;
//     }
//     wechatLog(code).then((res) => {
//       window.removeEventListener('hashchange', hashChangeEv);
//       if (res?.code === SUCCESS_CODE) {
//         // 1. data.flag == bind
//         if (res?.data.flag === 'bind') {
//           message.error({
//             content: '当前微信未绑定用户，请使用账号密码登录',
//             key: 'login_msg',
//           });
//           setType('account');
//           return false;
//         }
//         // 2. data.flag == select
//         if (res?.data.flag === 'select') {
//           // TODO: 跳转用户选择界面
//           setUserList(res?.data.userList || []);
//           setType('select');
//           return true;
//         }
//         // 3. data.flag == ok
//         if (res?.data.flag === 'ok') {
//           fetchUserInfo().then(() => {
//             window.location.href = '#/';
//             message.success({
//               content: '微信登录成功',
//               key: 'login_msg',
//             });
//             return true;
//           });
//         }
//       }
//       message.error({
//         content: '微信登录失败，请使用账号密码登录',
//         key: 'login_msg',
//       });
//       setType('account');
//       return false;
//     });
//   };

//   useLayoutEffect(() => {
//     if (type == 'wechat') {
//       //@ts-ignore
//       let WxLogin: WxLogin = window.WxLogin;
//       window.addEventListener('hashchange', hashChangeEv);
//       if (!WxLogin) {
//         const wxScript = document.createElement('script');
//         wxScript.type = 'text/javascript';
//         wxScript.src = 'https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js';
//         document.getElementById('root')?.appendChild(wxScript);
//         wxScript.onload = () => {
//           //@ts-ignore
//           WxLogin = window.WxLogin;
//           WxLogin({
//             id: 'wx_login_container',
//             appid: 'wx6931368614167a4a',
//             scope: 'snsapi_login,snsapi_userinfo',
//             redirect_uri: encodeURIComponent('https://m.charge.movebroad.com/#/user/login'),
//             state: randomCode,
//           });
//         };
//       } else {
//         WxLogin({
//           id: 'wx_login_container',
//           appid: 'wx6931368614167a4a',
//           scope: 'snsapi_login,snsapi_userinfo',
//           redirect_uri: encodeURIComponent('https://m.charge.movebroad.com/#/user/login'),
//           state: randomCode,
//         });
//       }
//     } else {
//       window.removeEventListener('hashchange', hashChangeEv);
//     }
//     return () => {
//       window.removeEventListener('hashchange', hashChangeEv);
//     };
//   }, [type]);

//   const fetchUserInfo = async () => {
//     const userInfo = await queryCurrentUser();
//     if (userInfo) {
//       setInitialState({
//         ...initialState,
//         currentUser: userInfo,
//       });
//     }
//   };

//   const { code, message: mmsg } = userLoginState;

//   return (
//     <div className={styles.container}>
//       <div className={styles.content}>
//         <LoginForm
//           logo={<img alt="logo" src="/logo.svg" />}
//           title="一九智慧停车"
//           subTitle={'停车收费管理平台'}
//           initialValues={{
//             autoLogin: true,
//           }}
//           submitter={type !== 'wechat' ? undefined : false}
//           onFinish={async (values) => {
//             if (type === 'wechat') return;

//             try {
//               let msg: API.LoginResult = {
//                 code: -1,
//                 message: '登录失败，请重试！',
//               };
//               if (type === 'account') {
//                 // 登录
//                 msg = await login({ ...values });
//               } else if (type === 'select') {
//                 if (!selectedUserid) {
//                   setUserLoginState({
//                     code: -1,
//                     message: '请选择要登录的用户',
//                   });
//                   return;
//                 }
//                 msg = await wechatSelectLogin(selectedUserid);
//               }
//               if (msg?.code === SUCCESS_CODE) {
//                 await fetchUserInfo();
//                 window.location.href = '#/';
//                 const defaultLoginSuccessMessage = '登录成功！';
//                 message.success({ content: defaultLoginSuccessMessage, key: 'login_msg' });
//                 return;
//               }
//               // 如果失败去设置用户错误信息
//               setUserLoginState(msg);

//               return;
//             } catch (error) {
//               const defaultLoginFailureMessage = '登录失败，请重试！';
//               message.error({ content: defaultLoginFailureMessage, key: 'login_msg' });
//               return;
//             }
//           }}
//         >
//           {type !== 'select' && (
//             <Tabs
//               activeKey={type}
//               onChange={(currtype) => {
//                 if (currtype !== 'wechat') {
//                   window.removeEventListener('hashchange', hashChangeEv);
//                 }
//                 setType(currtype);
//               }}
//             >
//               <Tabs.TabPane key="account" tab={'账户密码登录'} />
//               <Tabs.TabPane key="wechat" tab="微信登录" />
//             </Tabs>
//           )}
//           {typeof code === 'number' && code !== SUCCESS_CODE && (
//             <LoginMessage content={mmsg || '账户或密码错误'} />
//           )}
//           {type === 'account' && (
//             <>
//               <ProFormText
//                 name="account"
//                 fieldProps={{
//                   size: 'large',
//                   prefix: <UserOutlined className={styles.prefixIcon} />,
//                 }}
//                 placeholder={'用户名'}
//                 rules={[
//                   {
//                     required: true,
//                     message: '请输入用户名!',
//                   },
//                 ]}
//               />
//               <ProFormText.Password
//                 name="password"
//                 fieldProps={{
//                   size: 'large',
//                   prefix: <LockOutlined className={styles.prefixIcon} />,
//                 }}
//                 placeholder={'密码'}
//                 rules={[
//                   {
//                     required: true,
//                     message: '请输入密码！',
//                   },
//                 ]}
//               />
//             </>
//           )}
//           {type === 'wechat' && <div id="wx_login_container"></div>}
//           {type === 'select' && (
//             <>
//               <h3>请选择要登录的账号</h3>
//               <ul className={styles.userSelectWrap}>
//                 {userList.map((item) => (
//                   <li
//                     className={styles.userSelectItem}
//                     key={item.account}
//                     onClick={() => {
//                       setUserLoginState({});
//                       setSelectedUserid(item.userid);
//                     }}
//                   >
//                     <span className={styles.itemAccount}>
//                       {item.userName}（{item.account}）
//                     </span>
//                     <span>
//                       {selectedUserid === item.userid && (
//                         <CheckOutlined style={{ color: 'green' }} />
//                       )}
//                     </span>
//                   </li>
//                 ))}
//               </ul>
//             </>
//           )}
//         </LoginForm>
//       </div>
//       <Footer />
//     </div>
//   );
// };

// export default Login;
